import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'


//4个子模块
const child1=()=>import('../views/childviews/child1.vue');
const child2=()=>import('../views/childviews/child2.vue');
const child3=()=>import('../views/childviews/child3.vue');
const child4=()=>import('../views/childviews/child4.vue');

Vue.use(VueRouter)

const routes = [
  {
    path: '*',
    redirect: '/home'
  },
  {
    path: '/home',
    name: 'home',
    component: Home,
    meta:{
      title:''
    },
    children:[
      {
        path:'child1',
        component:child1
      },
      {
        path:'child2',
        component:child2
      },
      {
        path:'child3',
        component:child3
      },
      {
        path:'child4',
        component:child4
      }
    ]
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

router.beforeEach((to,from,next)=>{
  //从from跳转到to
  // console.log(to)
  if(to.matched[0].meta.title==undefined || to.matched[0].meta.title=='') to.matched[0].meta.title="无标题"
  document.title=to.matched[0].meta.title;
  //next(),正常执行下一步(必须调用)
  next();
  // console.log('跳转前执行')
})
router.afterEach((to,from)=>{
  // console.log('跳转后执行')
})

export default router;
